require('styles/MovieOverview.less')
import React from 'react'

class MovieOverview extends React.Component{
  render(){
    return (
      <div className="cpn-movie-overview">
        <h2>{this.props.title}</h2>
        <div className="left">
          <img src={this.props.imgUrl}/>
        </div>
        <div className="right">
          <div className="director">导演：{this.props.director}</div>
          <div className="casts">主演：{this.props.casts && this.props.casts.join(', ')}</div>
          <p className="desc">{this.props.desc}</p>
        </div>
        <div className="clear"/>
      </div>
    )
  }
}

MovieOverview.propTypes = {
  title: React.PropTypes.string.isRequired,
  imgUrl: React.PropTypes.string.isRequired,
  director: React.PropTypes.string.isRequired,
  casts: React.PropTypes.arrayOf(React.PropTypes.string).isRequired,
  desc: React.PropTypes.string
}

export default MovieOverview
